/*
使用Scroll滚动相关函数
 */
import type {Ref} from 'vue'
import {nextTick, ref} from 'vue'

type ScrollElement = HTMLDivElement | null

interface ScrollReturn {
	scrollRef: Ref<ScrollElement>
	scrollToBottom: () => Promise<void>
	scrollToTop: () => Promise<void>
	scrollToBottomIfAtBottom: () => Promise<void>
}

export function useScroll(): ScrollReturn {
	const scrollRef = ref<ScrollElement>(null)

	const scrollToBottom = async () => {
		await nextTick()
		if (scrollRef.value) {
			scrollRef.value.scrollTop = scrollRef.value.scrollHeight
		}
	}

	const scrollToTop = async () => {
		await nextTick()
		if (scrollRef.value) {
			scrollRef.value.scrollTop = 0
		}
	}

	const scrollToBottomIfAtBottom = async () => {
		await nextTick()
		if (scrollRef.value) {
			const threshold = 100 // 阈值，表示滚动条到底部的距离阈值
			const distanceToBottom = scrollRef.value.scrollHeight - scrollRef.value.scrollTop - scrollRef.value.clientHeight
			if (distanceToBottom <= threshold) {
				scrollRef.value.scrollTop = scrollRef.value.scrollHeight
			}
		}
	}

	return {
		scrollRef,
		scrollToBottom,
		scrollToTop,
		scrollToBottomIfAtBottom,
	}
}
